<template>
	<div class="search">
		<slot name="one">
			<div class="title">
				<router-link to="newlys">
					<img src="../../public/arrow_left.png" alt="">
				</router-link>
				<p class="users">搜索地址</p>
			</div>
			<div class="con">
				<input type="text" placeholder="请输入小区/写字楼/学校等">
				<button @click="sure">确认</button>
			</div>
			<div class="p">
				<p>为了满足商家的送餐要求,建议您从列表中选择地址</p>
			</div>
			<div class="q" v-show="sd">
				<p>找不到地址?</p>
				<p>请尝试输入小区、写字楼或学校名</p>
				<p>详细地址(如门牌号)可稍后输入哦</p>
			</div>

		</slot>
	</div>
</template>

<script>
	export default {
		data: function() {
			return {
				sd: true,

			}
		},
		methods: {
			sure() {
				this.$axios({
					url: 'https://elm.cangdu.org/v1/users/:' + this.id + '/addresses',
					method: 'get'
				}).then(res => {
					window.console.log(res)
				})
			},
		},
		created() {
			let obj = this;
			this.$axios({
				url: 'https://elm.cangdu.org/v1/users/'+obj.id+'/addresses',
				method: 'get'
			}).then(res => {
				window.console.log(res)
			})
		}
	}
</script>

<style scoped>
	.search {
		width: 320px;
		height: 568px;
		background-color: #F2F2F2;
	}

	.title {
		width: 320px;
		height: 39px;
		background-color: #007AFF;
		line-height: 39px;
		text-align: center;
	}

	.title img {
		width: 30px;
		height: 35px;
		float: left;
		margin-left: 10px;
		margin-top: 5px;
	}

	.users {
		font-size: 16px;
		color: white;
	}

	.con {
		width: 320px;
		height: 54px;
		background-color: #FFFFFF;
		position: relative;
		line-height: 54px;
	}

	.con input {
		width: 236px;
		height: 34px;
		background-color: #F2F2F2;
		border: 1px solid gainsboro;
		outline: none;
		border-radius: 5px;
		position: absolute;
		left: 8px;
		top: 5px;
		text-indent: 10px;
	}

	.con button {
		width: 60px;
		height: 34px;
		position: absolute;
		top: 5px;
		right: 5px;
		background-color: #3199E8;
		font-size: 14px;
		color: white;
		border-radius: 5px;
		border: none;
		line-height: 34px;
	}

	.p {
		width: 320px;
		height: 24px;
		background-color: #FFF6E4;
		color: #FF883F;
		font-size: 12.4px;
	}

	.p p {
		padding: 4px;
		text-indent: 10px;
	}

	.q {
		width: 320px;
		height: 50px;
		margin: 150px auto;
		font-size: 14px;
		color: #969696;
		text-align: center;
	}

	.q p {
		margin-top: 10px;
	}
</style>
